import React from 'react'
// ===================================================================== Temp
import SearchForm from '#cpt/temp/SearchForm'
import Table from '#cpt/temp/Table'
import FormModal from '#cpt/temp/FormModal'
// ===================================================================== global declare
const { $fn, $Lazy } = window
// ===================================================================== antd
const $time 	= $Lazy.file(()=>import('@com/utils/time'))
const $cache 	= $Lazy.file(()=>import('#private/cache-api'))
const enabledData = [{ name:'标箱使用中', value:1 },{ name:'标箱已被接收', value:2 }]
// ===================================================================== component
class Index extends React.Component{
	state = {
		data:[],
		pag: {},
		taps:[],
		forms: [
			{ label: '标箱编号',		name: 'box_number' },
			{ label: '领取时间',		names: ['start_date','end_date'],	type: 'date-range', format:1 },
			{ label: '物流状态',		name: 'follow_status',				type: 'select'  },
		],
		// 提交表单列表
		formData : [
			{ label: '标箱条码',  	name: 'box_code', 		full:true, required:true, type:'select', nameStr:'box_code', idStr:'box_code' },
			{ label: '领取时间',  	name: 'use_time', 		full:true, required:true, type:'date-time' },
			{ label: '备注',		name: 'content', 		full:true, 	type:'textarea' },
		]
	}
	
	model = {}
	query = { status:'1' }
	
	componentDidMount(){
		const { status } = this.props
		if(status){ this.query.status = status }
		
		this.getSelect()
		if(window.isInit){
		  this.fetch()
		}
	}
	// 获取下拉数据
	getSelect = () => {
		const { forms } = this.state
		
		$cache.then( async f => {
			// 项目名称
			$fn.setRow(forms, 'follow_status',  await f.getDisCache({ code:43400 }))
			
			this.setState({ forms })
		})
	}
	
	// paging
	fetch = () => $fn.fetch.call(this,'boxlogs/myboxlists', { isIndex: true })
	
	cols = [
		{ title: '标箱条码', 	dataIndex: 'box_code', 				width:150 },
		{ title: '标箱编号', 	dataIndex: 'box_number', 			width:150},
		{ title: '容量', 		dataIndex: 'total_count', 			width:100},
		{ title: '办事处地址', 	dataIndex: 'address', 				width:200},
		{ title: '办事处名称', 	dataIndex: 'contact_name', 			width:200 },
		{ title: 'GPS设备', 	dataIndex: 'gps_number', 			width:150 },
		{ title: '标本数量', 	dataIndex: 'spec_count', 			...$fn.table.num },
		{ title: '标箱状态', 	dataIndex: 'status', 				...$fn.table.status,  render: text=>$fn.getState(enabledData,text)  },
		{ title: '物流状态', 	dataIndex: 'follow_status_name', 	width:150 },
		{ title: '领取时间', 	dataIndex: 'created_at', 			...$fn.table.time },
	]
	
	open = () => {
		this.modal.open({ formRef: this.formRef})
		$time.then(f=> this.formRef.setValue({use_time: f.getNow()}))
		this.getModalSelect()
	}
	
	// 获取弹框下拉
	getModalSelect = async () => {
		const { formData } = this.state
		$fn.setModalRows(formData, 'box_code', ()=>{
			$cache.then( async f => {
				// 标箱条码
				$fn.setRow(formData, 'box_code', await f.getCache({ api:'box/select', param:{limit:500}, refresh:true}))
				this.setState({ formData })
			})
		})
	}
	
	render(){
		return (
			<>
				{/* 搜索 */}
				{ SearchForm.call(this) }
				{/* 表格 */}
				{ Table.call(this, { isIndex: true, isInit: window.isInit }) }
				{/* 领取 */}
				{ FormModal.call(this,{ title: '领取', labelWidth:'s8', width:750, api:'boxlogs/add'}) }
			</>
		)
	}
}

export default Index